<template>
    <div class="app-container">
        <el-container>
            <el-header style="height:35px;line-height:45px;">信息发布
                <div class="csstop">
                    <div class="cssborder"></div>
                    <div class="cssborder2"></div>
                    <div class="cssborder3"></div>
                </div>
            </el-header>
            <el-main>
                <transaction-table />
            </el-main>
        </el-container>
    </div>

</template>

<script>
import TransactionTable from './components/TransactionTable'

export default {
  components: {
    TransactionTable
  }
}
</script>


<style lang="scss" scoped>
.el-container {
  margin: 20px 30px 30px 50px;
  height: 65vh;
  
}

.el-header {
  background: #284358;
  color: #fff;
  text-align: center;
  line-height: 60px;
  height: 40px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  position: relative;
    .csstop {
        position: absolute;
        bottom: -16px;
        width: calc(100% - 60px);
        .cssborder {
            background: #ffffff;
            position: relative;
            height: 10px;
            line-height: 10px;
            width: 28%;
            float: left;
            z-index: 1111;
            &::after {
                content: '';
                width: 0;
                height: 0;
                border-bottom: 10px solid transparent;
                border-right: 15px solid #284358;
                position: absolute;
                right: 0;
                top: 0;
            }
        }
        .cssborder2 {
            background: #284358;
            position: relative;
            height: 10px;
            line-height: 10px;
            width: 44%;
            float: left;
            z-index: 1111;
        }
        .cssborder3 {
            background: #ffffff;
            position: relative;
            margin-bottom: 5px;
            height: 10px;
            line-height: 10px;
            width: 28%;
            float: left;
            z-index: 1111;
            &::after {
                content: '';
                width: 0;
                height: 0;
                border-bottom: 10px solid transparent;
                border-left: 15px solid #284358;
                position: absolute;
                left: 0;
                top: 0;
            }
        }
    }
 }

.el-main {
  height: 100%;
  padding: 1px;
  padding-top: 25px;
  border: solid 1px #284358;
}
</style>
